<template>
	<cu-page-base  :nav-bar-options="navBarOptions">
		<view class="cu-w-100 cu-px-20 cu-pt-50">
			<u-row justify="space-between" gutter="10">
				<u-col span="6">
					<view class="cu-w-100 cu-bg-main cu-shadow cu-d-flex cu-j-center cu-a-center cu-flex-column cu-border-r-10" :style="{
						height:'140rpx',
					}">
						<u-count-to :endVal="getWords" :font-size="40" separator="," :duration="1000" :bold="true"></u-count-to>
						<view @click="gotoPage('/pages/oauth/account/words/words','navigate')"><text class="cu-font-sm cu-border-bottom cu-border-main">可用字符</text><uni-icons type="forward" size="14"></uni-icons></view>
					</view>
				</u-col>
				<u-col span="6">
					<view class="cu-w-100 cu-bg-main cu-shadow cu-d-flex cu-j-center cu-a-center cu-flex-column cu-border-r-10" :style="{
						height:'140rpx',
					}">
						<u-count-to :endVal="getScores" :font-size="40" separator="," :duration="1500" :bold="true"></u-count-to>
						<view @click="gotoPage('/pages/oauth/account/scores/scores','navigate')"><text class="cu-font-sm cu-border-bottom cu-border-main">我的积分</text><uni-icons type="forward" size="14"></uni-icons></view>
					</view>
				</u-col>
			</u-row>
			<view class="cu-w-100 cu-mt-20">
				<cu-sign :signed="loginStore.signed" :signed-list="loginStore.signedList" @sign="signFun"></cu-sign>
			</view>
		</view>
		<u-modal :show="showModal" @close="closeModal" @cancel="closeModal" @confirm="confirmModal" ref="uModal"
			:title="modal.title" :content='modal.content' :zoom="true" :showCancelButton="true"
			:closeOnClickOverlay="true"></u-modal>
	</cu-page-base>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import commMiXin from '@/common/mixin/common-mixin.js';
	export default {
		mixins: [commMiXin],
		computed: {
			...mapState({
				commonStore: state => state.commonStore,
				loginStore: state => state.loginStore,
			}),
			getWords() {
				let total = 0;
				if (this.loginStore && this.loginStore.accountinfo !== undefined) {
					const accountinfoArr = this.loginStore.accountinfo
					for (let accountinfo of accountinfoArr) {
						if (!accountinfo.use_up_mark) {
							total = total + accountinfo.words - accountinfo.used
						}
					}
				}
				return total
			},
			getScores() {
				let scores = 0;
				if (this.loginStore && this.loginStore.scores !== undefined) {
					const scoresArr = this.loginStore.scores
					if (scoresArr != null && scoresArr.length > 0 && scoresArr[0].balance >= 0) {
						scores = scoresArr[0].balance;
					}
				}
				return scores
			},
		},
		data() {
			return {
				showModal: false,
				modelType: "",
				modal: {
					title: '温馨提示',
					content: '您尚未登录，是否前往登录？'
				},
				navBarOptions: {
					title: "福利",
				},
			};
		},
		async onShow() {
			if (this.loginStore && this.loginStore.userinfo === undefined) {
				this.modelType = "login";
				this.showModal = true;
			} else if (this.showModal == true) {
				this.showModal = false;
			}
			
			if(this.loginStore.userinfo !== undefined){
				await this.$store.dispatch('loginStore/getAccoundinfo',{uid:this.loginStore.userinfo._id});
			}
			await this.$store.dispatch('loginStore/check2Days');
		},
		methods: {
			closeModal() {
				this.showModal = false;
				this.gotoPage("/pages/tabbar/index/index", "switchTab");
				// console.log('close');
			},
			confirmModal() {
				if (this.modelType === "login") {
					this.gotoPage("/pages/tabbar/mine/mine", "switchTab");
				}

			},
			signFun(){
				this.$store.dispatch('loginStore/sign');
			}
		}
	}
</script>

<style lang="scss">

</style>